<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<button onclick="removeLi()" value="">删除</button>
<ul>
    <li>熊大</li>
    <li>熊二</li>
    <li>光头强</li>
</ul>


<script>
    // 1.获取元素
    var ul = document.querySelector('ul');
    var btn = document.querySelector('button');

    // 2.删除元素  node.removeChild(child) 从DOM中删除一个子节点, 返回删除的节点
    // removeChild<T extends Node>(oldChild: T): T;
    function removeLi() {
        ul.removeChild(ul.children[0]);
        if (ul.children.length === 0) {
            btn.disabled = true;
            alert('ul元素为空了!!!')
        }

    }
</script>
</body>
</html>
